.revision-compare {
	display: flex;
	min-height: fit-content;
}
.revision-compare>.revision {
	flex: 1;
}
.revision-compare>.base {
	margin-right: 2rem;
}
.revision-compare>.swap {
	display: flex;
	align-items: center;
	margin-right: 2rem;
	justify-content: center;
}
@media(max-width: 767px) {
	.revision-compare {
		flex-wrap: wrap;
	}
	.revision-compare>* {
		flex: 0 0 100%;
	}
	.revision-compare>.base {
		margin-right: 0;
		margin-bottom: 2rem;
	}
	.revision-compare>.compare {
		margin-top: 2rem;
	}
	.revision-compare>.swap .icon {
		transform: rotate(90deg);
	}
}

.revision-compare .head {
	display: flex;
	align-items: center;
	margin-bottom: 1rem;
}
.revision-compare .title {
	font-weight: 600;
	font-size: 1.1rem;
	margin-bottom: 1rem;
}
.revision-compare .head .title {
	margin-bottom: 0;
}
.revision-compare .checkbox {
	margin-left: 1.5rem;
}
.revision-compare .help {
	margin-left: 0.5rem;
	color: var(--gray);
}
.dark-mode .revision-compare .help {
	margin-left: 0.5rem;
	color: var(--dark-mode-gray);
}
.revision-compare .selector {
	margin-bottom: 1rem;
}
.revision-compare .message {
	color: var(--muted);	
}
.dark-mode .revision-compare .message {
	color: var(--gray);	
}
.revision-compare .message:hover, .revision-compare .message:focus {
	color: var(--primary);
}
